<template>
  <z-paging ref="paging" v-model="dataList" @query="queryList">
    <view w-full px-20rpx box-border pt-20rpx>
      <view v-for="(item, index) in dataList" :key="index" bg-white rounded-20rpx px-20rpx pt-32rpx mt-20rpx>
        <view style="border-bottom: 1px solid #eee" @click="handleSeleckAddress(item)">
          <view flex items-center mb-20rpx>
            <view text-black text-32rpx mr-20rpx>{{ item.name }} {{ item.mobile }}</view>
            <view
              v-if="item.isDefault"
              bg="#FCC300"
              w-80rpx
              h-40rpx
              rounded-20rpx
              flex
              justify-center
              items-center
              text-24rpx
              text-white>
              默认
            </view>
          </view>
          <view text-black text-24rpx mb-20rpx>
            {{ item.consigneeAddressPath.replace(/,/g, '') }} {{ item.detail }}
          </view>
        </view>
        <view h-100rpx flex justify-between items-center>
          <view flex items-center @click.stop="useDefault(item)">
            <image v-if="item.isDefault" w-30rpx h-30rpx mr-16rpx src="@/pages/mine/static/check.png"></image>
            <image v-else w-30rpx h-30rpx mr-16rpx src="@/pages/mine/static/un_check.png"></image>
            <view text-24rpx>{{ item.isDefault ? '' : '设置' }}默认地址</view>
          </view>
          <view flex items-center text-24rpx>
            <view flex items-center mr-40rpx @click="handleClickAddress(item)">
              <image w-30rpx h-30rpx mr-10rpx src="@/pages/mine/static/edit.png"></image>
              <view class="">编辑</view>
            </view>
            <view flex items-center @click="handleClickDelete(item)">
              <image w-30rpx h-30rpx mr-10rpx src="@/pages/mine/static/delete.png"></image>
              <view class="">删除</view>
            </view>
          </view>
        </view>
      </view>
    </view>
    <template #bottom>
      <view w-full px-40rpx pb-46rpx pt-20rpx box-border>
        <view
          w-670rpx
          h-100rpx
          rounded-50rpx
          bg="#FCC300"
          flex
          justify-center
          items-center
          font-500
          text="#000"
          text-32rpx
          @click="$navigateTo('/pages/mine/address/detail')">
          添加地址
        </view>
      </view>
    </template>
  </z-paging>
</template>
<script setup lang="ts">
import { setAddressDefault, setAddressId, deleteAddress } from '@/api/address'
import { getAddressList } from '@/api/address'
// import submit from '@/components/sheet-btn/index.vue'
// import { colors } from '@/constants/injection-key'
import { onShow, onLoad } from '@dcloudio/uni-app'

const paging = ref<any>(null)

const props = defineProps({
  type: {
    type: String,
    default: 'NORMAL'
  },
  setupDefault: {
    type: Boolean,
    default: false
  },
  way: {
    type: String,
    default: ''
  }
})
const isSelect = ref(true)
const show = ref<boolean>(false)
const current = ref({
  id: 0
})

const dataList = ref<any>([])

const queryList = (pageNo: number, pageSize: number) => {
  getAddressList({ pageNumber: pageNo, pageSize })
    .then((res: any) => paging.value.complete(res.data.result))
    .catch(() => paging.value.complete(false))
}

// 设置为默认
async function useDefault(item: any) {
  if (item.isDefault) {
    return
  }
  console.log('当前信息', item)
  // 查询出当前地址信息
  const currentAddress = dataList.value.find((i: any) => i.id === item.id) || {}
  const submit = { ...currentAddress, isDefault: true }
  console.log('当前要提交', submit)
  const res = await setAddressDefault(submit)
  if (res.data.success) {
    uni.showToast({
      title: '设置成功',
      icon: 'none'
    })
    init()
  }
}

function init() {
  paging.value.reload()
}

// 选择地址
async function handleSeleckAddress(item: any) {
  if (isSelect.value) {
    await setAddressId(item.id, props.way)
    uni.navigateBack({
      delta: 1
    })
  } else {
    handleClickAddress(item)
  }
}

// 确认删除
async function handleClickDelete(current: any) {
  uni.showModal({
    title: '提示',
    content: '是否删除这个地址？',
    confirmColor: '#FCC300',
    cancelColor: '#707175',
    async success(res) {
      if (res.confirm) {
        const res = await deleteAddress(current.id)
        if (res.data.success) {
          uni.showToast({
            title: '删除成功',
            icon: 'none'
          })
          init()
        }
      } else if (res.cancel) {
        console.log('用户点击取消')
      }
    }
  })
}
function handleClickAddress(current: any) {
  const val = dataList.value.find((item: any) => {
    return item.id === current.id
  })
  navigateTo(current.id, val)
}


// 跳转到地址详情
function navigateTo(id = '', data?: any) {
  let src = props.type ? `/pages/mine/addressMine/detail?type=${props.type}` : '/pages/mine/addressMine/detail'
  if (id) src = `/pages/mine/addressMine/detail?id=${id}&data=${encodeURIComponent(JSON.stringify(data))}`
  uni.navigateTo({
    url: src
  })
}

onMounted(() => {})

onLoad((options: any) => {
  if (options.isSelect) {
    isSelect.value = options.isSelect == 1
  }
})
onShow(() => {
  init()
})
</script>

<style scoped></style>
